/// <reference path="../../base/jquery.min.js" />

var $FileUploader = function (opts) {
    var _enum = {
        Q_EXCEED_NUM_LIMIT: "添加的文件数量已超出最大限制数量",
        Q_EXCEED_SIZE_LIMIT: "添加的文件过大了",
        Q_TYPE_DENIED: "不支持该类型文件加入上传列表",
        F_EXCEED_SIZE: "添加的文件过大了"
    }
    var _defaultOpts = {
        dom: {
            imgListel: "#list-upload",
            uploadBtn: "#btn-upload",
            filePrefix: "",
        },
        upload: {
            server: "http://api.manage.meiyungou.jshcn.cn/upload/pic",
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            },
            pick: {
                multiple: true,
                id: "#btn-upload",
                innerHTML: "选择文件"
            },
            auto: true,
            thumb: {
                width: 110,
                height: 110,
                // 图片质量，只有type为`image/jpeg`的时候才有效。
                quality: 100,
                // 是否允许放大，如果想要生成小图的时候不失真，此选项应该设置为false.
                allowMagnify: true,
                // 是否允许裁剪。
                crop: true
            },
            threads: 3,
            fileVal: "fileupload",
            fileNumLimit: 3,
            fileSingleSizeLimit: 1 * 1024 * 1024,
            compress: {
                compressSize: 500 * 1024
            }
        },
        event: {
            succee: function () {}
        }
    };
    opts = Object.assign(_defaultOpts, opts);
    opts.upload.pick.id = opts.dom.uploadBtn;
    var _WebUploader = WebUploader.create(opts.upload);
    //当文件被加入队列之前触发
    _WebUploader.on("beforeFileQueued", function (file) {
        _WebUploader.on('error', function (handler) {
            var msg = eval("_enum." + handler);
            $.toptip(msg, 'warning');
        })
    })

    //当文件被加入队列以后触发
    _WebUploader.on("fileQueued", function (file) {
        _WebUploader.makeThumb(file, function (error, ret) {
            var _html = '<li id="' + file.id + '" class="weui-uploader__file">';
            if (error) { //不是图片 无法解析base64
                _html += ' <img src="" style="width:100%" />';
            } else {
                _html += ' <img src="' + ret + '" style="width:100%" />';
            }
            _html += '<div data-cacel=""><i class="icon icon-shanchu"></i></div>' +
                ' <div data-progress="">' +
                '     <div class="weui-progress">' +
                '         <div class="weui-progress__bar">' +
                '             <div class="weui-progress__inner-bar js_progress" data-progress="text" style="width: 0%;"></div>' +
                '         </div>' +
                '     </div>' +
                ' </div>';
            $(opts.dom.imgListel).append(_html);
        })
    })

    //当文件被移除队列后触发 删除实时显示文件效果图
    _WebUploader.on("fileDequeued", function (file) {
        $("#" + file.id).remove();
    });

    //上传进度条
    _WebUploader.on("uploadProgress", function (file, Number) {
        $("#" + file.id + "> div[data-progress] div[data-progress='text']").css({
            width: parseInt(Number * 100) + "%"
        });
    })

    //上传成功触发
    _WebUploader.on("uploadSuccess", function (file, response) {

        var data = JSON.parse(response._raw);
        if (opts.dom.filePrefix != "") {
            data.url = opts.dom.filePrefix + data.url;
        }
        opts.event.succee(data);
    });

    //上传错误 
    _WebUploader.on("uploadError", function (file, response) {

    });

    //不管成功失败都会调用
    _WebUploader.on("uploadComplete", function (file) {

    })

    $("#list-upload").on("click", ">li>div[data-cacel]", function () {
        var id = $(this).parents("li").attr("id");
        _WebUploader.removeFile(id, true);
        $(this).parent("li").remove();
    })
}